﻿<%@ Page Title="" Language="C#" MasterPageFile="~/Views/Shared/Site.Master" Inherits="System.Web.Mvc.ViewPage<dynamic>" %>
<%@ Import Namespace="B2B.Models" %>
<asp:Content ID="Content1" ContentPlaceHolderID="MainContent" runat="server">

<h2>DangKy</h2>

</asp:Content>

<asp:Content ID="Content2" ContentPlaceHolderID="HEAD" runat="server">
</asp:Content>

<asp:Content ID="Content3" ContentPlaceHolderID="main_content" runat="server">

    <script type="text/ecmascript">
        function checkDangKy() {
            isValid = true;
            var email = $("#email").val();
            var password = $("#password").val();
            var repassword = $("#repassword").val();
            var name = $("#hoten").val();
            var companyname = $("#tencongty").val();
            var tel = $("#sodt").val();
            if (email.length == 0) {
                $("#checkEmail").html("*Please enter your email");
                isValid = false;
            }
            if (password.length == 0) {
                $("#checkPassword").html("*Please enter your password");
                isValid = false
            }
            if (repassword.length == 0) {
                $("#checkRePassword").html("*Please enter your password again");
                isValid = false
            }
            if (name.length == 0) {
                $("#checkHoTen").html("*Please enter your name");
                isValid = false
            }
            if (companyname.length == 0) {
                $("#checkTenCongTy").html("*Please enter your company name or your full name");
                isValid = false
            }
            if (tel.length == 0) {
                $("#checkSoDT").html("*Please enter your tel");
                isValid = false
            }
            return isValid;
                

        }

        function checkEmail() {
            $("#checkEmail").html("");
            var email = $("#email").val();
            if (email.length == 0) {
                $("#checkEmail").html("*Please enter your email");
                return;
            }
            var regex = /^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/;
            if(regex.test(email) == false) {
                $("#checkEmail").html("*Your email is not format");
                return;
            }
        }

        function checkPassword() {
            $("#checkPassword").html("");
            var password = $("#password").val();
            if (password.length == 0) {
                $("#checkPassword").html("*Please enter your password");
            }
            if (password.length < 4) {
                $("#checkPassword").html("Please enter 6 - 20 characters(A-Z,a-z,0-9 only)");
                return;
            }
            if (password.length > 20) {
                $("#checkPassword").html("*Please enter 6 - 20 characters(A-Z,a-z,0-9 only)");
                return;
            }
        }

        function checkRePassword() {
            $("#checkRePassword").html("");
            var repassword = $("#repassword").val();
            var password = $("#password").val();
            if (repassword.length == 0) {
                $("#checkRePassword").html("*Please enter your repassword");
                return;
            }
            if (repassword != password) {
                $("#checkRePassword").html("*Passwords are not the same");
                return;
            }
        }

        function checkName() {
            $("#checkHoTen").html("");
            var name = $("#hoten").val();
            if (name.length == 0)
                $("#checkHoTen").html("*Please enter your name");
        }

        function checkCompanyName() {
            $("#checkTenCongTy").html("");
            var companyname = $("#tencongty").val();
            if (companyname.length == 0)
                $("#checkTenCongTy").html("*Please enter your company name or your full name");
        }

        function checkTel() {
            $("#checkSoDT").html("");
            var tel = $("#sodt").val();
            if (tel.length == 0)
                $("#checkSoDT").html("*Please enter your tel");
        }

        function onlyNumbers(e) {

            var keyword = null;
            if (window.event) {
                keyword = window.event.keyCode;
            } else {
                keyword = e.which; //NON IE;
            }

            if (keyword < 48 || keyword > 57) {
                if (keyword == 48 || keyword == 127 || keyword == 8) {
                    return;
                }
                $("#CheckQuantity").html("You have to enter number");
                return false;
            }
            $("#CheckQuantity").html("");
        }

        function DangKy() {
            var email = $("#email").val();
            var password = $("#password").val();
            var repassword = $("#repassword").val();
            var name = $("#hoten").val();
            var companyname = $("#tencongty").val();
            var tel = $("#sodt").val();
            var isValid = checkDangKy();
            if (isValid == false)
                return;
        }

    </script>
    <% ArrayList ds_QG = (ArrayList)ViewData["ds_QG"]; %>
    <div align="center">
        <form action="/Home/AddUser">
            <table border="0"  cellspacing="5" cellpadding="5">
                <tr>
                    <th align="center" colspan="3">
                       <h3> Account Registation </h3>
                    </th>
                </tr>
                <tr>
                    
                    <th align="left" colspan="3"><hr /> <h4> Create account </h4> <hr /></th>
                    
                </tr>
                <tr>
                    <th align="right">Email: </th>
                    <td><input type="text" name="email" id="email" onblur="checkEmail()" /></td>
                    <td style="width:250px; color:red" id="checkEmail"></td>
                </tr>
                <tr>
                    <th align="right">Password: </th>
                    <td><input type="password" name="password" id="password" onblur="checkPassword()" /></td>
                     <td style="width:250px; color:red" id="checkPassword"></td>
                </tr>
                <tr>
                    <th align="right">Re-enter password: </th>
                    <td><input type="password" id="repassword" onblur="checkRePassword()" /></td>
                    <td style="width:250px; color:red" id="checkRePassword"></td>
                </tr>
                <tr>
                    <th align="left" colspan="3">
                        <hr /> <h4> Enter Information </h4> <hr />
                    </th>
                </tr>
                <tr>
                    <th align="right">National: </th>
                    <td>
                        <select name="maQG">
                            <option value="0">--Please select national--</option>
                            <%foreach(var qg in ds_QG){ %>
                                <option value="<%=((SP_DanhSachQG)qg).MaQG %>"> <%=((SP_DanhSachQG)qg).TenQG %></option>
                            <%} %>
                        </select>
                    </td>
                    <td style="width:250px" id="checkNational"></td>
                </tr>
                <tr>
                    <th align="right">I am a:</th>
                    <td>                        
                        <input type="radio" name="LoaiTV" value="1" checked="checked" />&nbsp;Supplier &nbsp; &nbsp;&nbsp; 
                        <input type="radio" name="LoaiTV" value="2" />&nbsp;Buyer  &nbsp; &nbsp;&nbsp;
                        <input type="radio" name="LoaiTV" value="3" />&nbsp;Both  
                    </td>
                </tr>
                <tr>
                    <th align="right">Name: </th>
                    <td><input type="text" name="hoTen" id="hoten" onblur=" checkName()" /></td>
                     <td style="width:250px; color:red" id="checkHoTen"></td>
                </tr>
                <tr>
                    <th align="right">Company Name:</th>
                    <td><input type="text" name="tenCongTy" id="tencongty" onblur="checkCompanyName()"/></td>
                     <td style="width:250px; color:red" id="checkTenCongTy"></td>
                </tr>
                <tr>
                    <th align="right">Website: </th>
                    <td><input type="text" name="website" id="website" /></td>
                    <td style="width:250px; color:red" id="checkWebsite"></td>
                </tr>
                <tr>
                    <th align="right">Tel: </th>
                    <td><input type="number" name="soDT" id="sodt" onkeypress="return onlyNumbers(event)" onblur="checkTel()" /></td>
                     <td style="width:250px;color:red" id="checkSoDT"></td>
                </tr>
                <tr>
                    <td></td>
                    <td align="left">                        
                        <input type="submit" value="Create Account" onclick="return checkDangKy();" />
                    </td>
                    <td></td>
                </tr>
            </table>
        </form>
    </div>
</asp:Content>
